<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/pages/comm/comm.jsp"%>
<link href="${ctx }/static/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
<link href="${ctx }/static/css/bootstrap-responsive.min.css" rel="stylesheet" type="text/css" />
<%-- <link href="${ctx }/static/css/font-awesome.min.css" rel="stylesheet" type="text/css" /> --%>
<link href="${ctx }/static/css/style-metro.css" rel="stylesheet" type="text/css" />
<link href="${ctx }/static/css/style.css" rel="stylesheet" type="text/css" />
<link href="${ctx }/static/css/style-responsive.css" rel="stylesheet" type="text/css" />
<link href="${ctx }/static/css/default.css" rel="stylesheet" type="text/css" id="style_color" />
<link href="${ctx }/static/css/uniform.default.css" rel="stylesheet" type="text/css" />
<link href="${ctx }/static/css/pages.css" rel="stylesheet" type="text/css" />
<link href="${ctx }/static/css/DT_bootstrap.css" rel="stylesheet" type="text/css" />
<link href="${ctx }/static/css/select2_metro.css" rel="stylesheet" type="text/css" />
<!-- END GLOBAL MANDATORY STYLES -->
<!-- BEGIN PAGE LEVEL STYLES -->
<link href="${ctx }/static/css/bootstrap-tag.css" rel="stylesheet" type="text/css" />
<link href="${ctx }/static/css/bootstrap-wysihtml5.css" rel="stylesheet" type="text/css" />
<link href="${ctx }/static/css/jquery.fancybox.css" rel="stylesheet" />
<!-- BEGIN:File Upload Plugin CSS files-->
<link href="${ctx }/static/css/jquery.fileupload-ui.css" rel="stylesheet" type="text/css">
<link href="${ctx }/static/css/news.css" rel="stylesheet" type="text/css">
<link href="${ctx }/static/js/layer/skin/layer.css" rel="stylesheet" type="text/css">
<body>
<div class="row-fluid">
	<div class="span12">
		<!-- BEGIN SAMPLE FORM PORTLET-->
		<div class="portlet box red" style="margin-bottom:0px">
			<div class="portlet-body form">
				<!-- BEGIN FORM-->
				<form id="editForm" class="horizontal-form">
				    <input type="hidden" id="userId"  name="userId" value='${user.userId }'>
					<div class="row-fluid">
						<!--/span-->
						<div class="span4 ">
							<div class="control-group">
								<label class="control-label" for="">用户名*</label>
								<div class="controls">
									<input id="accountNo" name="accountNo" class="m-wrap span12" placeholder="请输入手机号/邮箱"
										type="text" data-rule="用户名: required" value="${user.accountNo }" readonly="readonly">
								</div>
							</div>
						</div>
					</div>
					<div class="row-fluid">
						<!--/span-->
						<div class="span4 ">
							<div class="control-group">
								<label class="control-label" for="">姓名</label>
								<div class="controls">
									<input id="userName"  name="userName" class="m-wrap span12" 
										type="text" value="${user.userName }">
								</div>
							</div>
						</div>
						<div class="span4 ">
							<div class="control-group">
								<label class="control-label" for="">性别</label>
								<div class="controls">
								   <input name="sex" value="1" type="radio"  <c:if test="${user.sex eq 1 }">checked="checked" </c:if>   /> 
								   <label class="radio"> 男</label>	 
								   <input name="sex" value="0"  type="radio" <c:if test="${user.sex eq 0 }">checked="checked" </c:if> />  
								   <label class="radio"> 女</label>
								</div>
							</div>
						</div>
					</div>

					<div class="row-fluid">
						<!--/span-->
						<div class="span4 ">
							<div class="control-group">
								<label class="control-label" for="">手机*</label>
								<div class="controls">
									<input id="tel" name="tel" class="m-wrap span12"  type="text" 
									data-rule="手机号: required" value="${user.tel }">
								</div>
							</div>
						</div>
						<div class="span4 ">
							<div class="control-group">
								<label class="control-label" for="">邮箱</label>
								<div class="controls">
									<input id="email" name="email" class="m-wrap span12" placeholder="邮箱" type="text"
									  value="${user.email }">
								</div>
							</div>
						</div>
					</div>

					<div class="row-fluid">
						<!--/span-->
						<div class="span12 ">
							<div class="control-group">
								<label class="control-label" for="">角色</label>
								<div class="controls">
								    <c:forEach  items="${roles }" var="item">
								      <input name="roleId" value="${item.roleId }" type="radio" <c:if test="${item.roleId == user.roleId }">  checked="checked" </c:if> >
									  <label class="checkbox"> ${item.roleName } </label>
								    </c:forEach>
								</div>
							</div>
						</div>
					</div>

					<div class="row-fluid">
						<div class="span4 ">
							<div class="control-group">
								<label class="control-label" for="">区域</label>
								<div class="controls">
									<select class="m-wrap span4" name="province">
										<option  value="410000000000">河南省</option>
									</select> 
									<select class="m-wrap span4" name="city" id="city"  onchange="openCounty()"  >
										<option value="">全部</option>
										<c:forEach items="${adminAreas }" var="item">
										   <option value="${item.areaNo }"  <c:if test="${user.city eq item.areaNo}"> selected="selected" </c:if> >${item.areaName }</option>
										</c:forEach>
									</select>
									<%-- <select class="m-wrap span4" name="county" id="county"  >
										<option value="">全部</option>
										<c:forEach items="${countys }" var="item">
										   <option value="${item.areaNo }"  <c:if test="${user.county eq item.areaNo}"> selected="selected" </c:if> >${item.areaName }</option>
										</c:forEach>
									</select> --%>
								</div>
							</div>
						</div>
						<div class="span4 ">
							<div class="control-group">
								<label class="control-label" for="">状态</label>
								<div class="controls">
										<select class="m-wrap span12" name="status">
										<option value="1" <c:if test="${user.isDel eq 1 }"> selected="selected" </c:if> >启用</option>
										<option value="0" <c:if test="${user.isDel eq 0 }"> selected="selected" </c:if> >禁用</option>
									</select>
								</div>
							</div>
						</div>
					</div>
					<div class="form-actions">
						<button type="button"  class="btn red" onclick="updateUser()">更新</button>
						<button type="button" class="btn" onclick="closeLaye()">取消</button>
					</div>
				</form>
				<!-- END FORM-->
			</div>
		</div>
		<!-- END SAMPLE FORM PORTLET-->
	</div>
</div>

<script src="${ctx }/static/js/jquery.js" type="text/javascript"></script>
<script type="text/javascript" src="${ctx }/static/js/layer/layer.js"></script>
<script type="text/javascript" src="${ctx }/static/js/nice-validator/jquery.validator.js"></script>
<script type="text/javascript" src="${ctx }/static/js/nice-validator/local/zh_CN.js"></script>

<script type="text/javascript">


function updateUser(){
		var flag = /^1[3|4|5|7|8][0-9]\d{8}$/.test($("#tel").val());
      	if(!flag){
      		layer.msg("手机号格式不正确");
      		return ;
      	}
      $.ajax({
			url: '${ctx}/user/update',
			type: 'post',
			dataType: 'json',
			data: $('#editForm').serialize(),
			success: function(data) {
			if(data.code=="200"){
			layer.msg("更新成功！");
			    window.parent.queryResult();
				window.parent.layer.closeAll();
			}else{
			layer.msg(data.msg);
			}
			}
	    });
}


function closeLaye(){
    window.parent.layer.closeAll();
}




//查询县级列表
function openCounty(){
    var areaNo =$("#city").val();
    if(areaNo  !=""){
      $.ajax({
		url: '${ctx}' +'/area/getCounty',
        type: 'post',
        dataType: 'json',
        data: {
          "cityId":areaNo
    	},
        success: function (data) {
        	$("#county").empty();
        	var optml=optionHtml(data.data);
        	$("#county").append(optml);
        }
	});
    }else{
       $("#county").empty();
       var ophtm="<option value='' >全部</option>";
       $("#county").append(ophtm);
    }
	
}
//组装html
function  optionHtml(data){
	var ophtm="<option value='' >全部</option>";
	for(var i=0;i<data.length;i++){
        ophtm+="<option value="+data[i].areaNo+">"+data[i].areaName+"</option>";
    }
	return ophtm;
}
</script>
</body>
</html>